<template>
  <div>
    <div v-if="arr.length">
      <div>
        <div v-for="(item, index) in arr" :key="index">
          <h4>{{ item.title }}</h4>
          <div class="imgwrap">
               <img  v-lazy="item.img" />
          </div>
        
        </div>
      </div>
    </div>
    <div v-else>暂无数据</div>
    <!-- 处理数据边界情况 -->
  </div>
</template>

<script>
import Vue from 'vue';
import { Lazyload } from 'vant';
import { computed } from "vue";
import { mapState, mapActions } from "vuex";

Vue.use(Lazyload);
export default {
  methods: {
    ...mapActions(["getList"]),
  },
  computed: {
    ...mapState(["arr"]),
  },
  mounted() {
    this.getList("内衣");
  },
};
</script>

<style scoped>
.imgwrap {
    margin-top: 30px;
}
</style>